<template>
	<view>
		<view class="details">
			<table cellSpacing="0" cellpadding="1" width="100%" class="ctl">
				<tBody>
					<tr v-if="memberName!='null'&&memberName!=''">
						<td class="td_1">姓名:</td>
						<td class="td">{{memberName}}</td>
					</tr>
					<tr v-if="memberName=='null'||memberName==''">
						<td class="td_1">房间:</td>
						<td class="td">{{buildingName}}</td>
					</tr>
					<tr>
						<td class="td_1">报警时间:</td>
						<td class="td">{{alarmTime}}</td>
					</tr>
					<tr>
						<td class="td_1">报警类型:</td>
						<td class="td">{{devName}}</td>
					</tr>
					<tr>
						<td class="td_1">报警信息:</td>
						<td class="td" style="color: #ff0000;">{{alarmDetail}}</td>
					</tr>
					<tr v-if="status=='1'">
						<td class="td_1">报警状态:</td>
						<td class="td" style="color: #1AFA29;">已解除</td>
					</tr>
				</tBody>
			</table>
		</view>
		<view class="uni-btn-v" v-if="status=='0'">
			<button form-type="submit" type="primary" @click="disarmTheAlarm()">解除告警</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				memberName:'',
				devName:'',
				alarmTime:'',
				alarmDetail:'',
				id:'',
				status:'',
				buildingName:'',
			}
		},
		onLoad: function(option) { 
			this.memberName = option.memberName
			this.devName = option.devName
			this.alarmTime = option.alarmTime
			this.alarmDetail = option.alarmDetail
			this.id = option.id
			this.status = option.status
			this.buildingName = option.buildingName
			// console.log(JSON.stringify(this.warningDetails))
			console.log(this.id,this.devName,this.alarmTime,this.alarmDetail,this.groupNames)
		},
		
		methods: {
			//解除警告
			async disarmTheAlarm(){
				const res =await this.$myRequest({
					url: '/api-alarm/alarms/'+this.id,
					method: "post",
				})
				if (res.success == true) {
					this.status="1"
					uni.navigateBack({
					    delta: 1
					});
					uni.$emit("planAdd",{status: 1,id:this.id});
				console.log("成功解除警告")
				}
			}
		}
	}
</script>

<style lang="scss">
	.details{
		background-color: #FFFFFF;
		font-size: 30rpx;
		.ctl {
			margin: 0 20rpx 0 30rpx;
			table-layout: fixed;
		
			.td_1 {
				height: 100rpx;
				// vertical-align: top;
				color: #959595;
				width: 25%;
				word-break: break-all;
			}
		
			.td {
				height: 100rpx;
				word-break: break-all;
				color: #000000;
			}
		}
	}
	.uni-btn-v {
		width: 80%;
		margin: 50rpx auto;
		}
</style>
